<template>
  <div class="join_page">
    <my-nav-bar title="我加入的">
          <div class="tab_content">
            <card-item v-for="(items, index) in allInfo"
                       :key="index"
                       :active-title="items.title || '幸运大抽奖'"
                       :active-start-date="items.startTime.split(' ')[0]"
                       :active-end-date="items.endTime.split(' ')[0]"
                       :activeState="status[items.status]"
                       :id="items.id"
            ></card-item>
          </div>
    </my-nav-bar>
  </div>
</template>

<script>
import MyNavBar from "../../../components/MyNavBar";
import CardItem from "./components/CardItem";
import {Tab, Tabs} from "vant"
import {getMyJoin} from "@/api/lucky";

export default {
  name: "IJoin",
  components: {
    MyNavBar,
    CardItem,
    [Tab.name]: Tab,
    [Tabs.name]: Tabs
  },
  data() {
    return {
      activeName: "a",
      ongoing: [],
      hasEnded: [],
      allInfo:[],
      status: ["","进行中", "已结束", ""]
    }
  },
  created(){
    getMyJoin({pageNum: 1, pageSize: 999})
    .then(res => {
      this.allInfo = res.data.list
    })
  }
}
</script>

<style scoped>
.join_page {
  background-color: rgb(247, 246, 251);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.tab_content {
  padding-top: 5px;
}
</style>
